<script setup lang="ts">
import { ref } from "vue";
import Tabs from "./components/Tabs.vue";
import Page from "@/components/common/Page.vue";
import PaneActivity from "./components/PaneActivity.vue";
import PaneWriteOff from "./components/PaneWriteOff.vue";
import PageHeader from "@/components/common/PageHeader.vue";

const active = ref(0);
</script>

<template>
  <Page hidden-header-bg>
    <template #header>
      <PageHeader class="bg-[#fff7ee]">
        <Tabs
          :capsule="false"
          v-model="active"
          :list="['活动数据', '核销数据']"
        />
      </PageHeader>
    </template>

    <PaneActivity v-if="active === 0" />
    <PaneWriteOff v-else />
  </Page>
</template>

<style lang="css">
page {
  background: linear-gradient(to bottom, #fff7ee, #dec2a0);
}
</style>
